<div class="content" layout-padding>
    <h1>
        添加税率信息
    </h1>
    <form name="TaxSettingFormBase">
        <md-input-container class="md-block">
            <label>税率方案名称</label>
            <input md-maxlength="20" minlength="2" required name="Name" ng-model="TaxSetting.Name">
            <div class="hint" ng-if="showHints">税率方案名称</div>
            <div ng-messages="TaxSettingFormBase.Name.$error">
                <div ng-message="required">请填写税率方案名称</div>
                <div ng-message="md-maxlength">税率方案名称不能超过20</div>
                <div ng-message="minlength">税率方案名称不能小于2</div>
            </div>
        </md-input-container>
        <md-input-container class="md-block">
            <label>税率方案描述</label>
            <input md-maxlength="50" minlength="6" required name="Description" ng-model="TaxSetting.Description">
            <div class="hint" ng-if="showHints">税率方案描述</div>
            <div ng-messages="TaxSettingFormBase.Description.$error">
                <div ng-message="required">请填写税率方案描述</div>
                <div ng-message="md-maxlength">税率方案描述不能超过50</div>
                <div ng-message="minlength">税率方案描述不能小于6</div>
            </div>
        </md-input-container>
    </form>
    <h1>
        税率阶段设置
    </h1>
    <form name="TaxSettingForm">
        <md-list>
            <md-list-item layout="row">
                <span flex>操作</span>
                <span flex>起征</span>
                <span flex>结束点</span>
                <span flex>税率 % </span>
            </md-list-item>
            <md-list-item ng-repeat="item in TaxSetting.Rules" layout="row" layout-align="center center">
                <div flex>
                    <md-button class="md-fab md-mini" ng-disabled="currentIndex>item.Index+1"
                               ng-click="deleteTaxItem()" aria-label="删除">
                        <i class="fa fa-times"></i>
                    </md-button>
                </div>

                <span flex ng-bind="item.Lowbound"></span>
                <span flex ng-bind="item.Upbound"></span>
                <span flex ng-bind="item.Rate"></span>
                <!--<md-input-container flex class="md-block">-->
                <!--<input min="0" max="10000000" type="number" required name="{{'Upbound'+$index}}"-->
                <!--ng-model="item.Upbound">-->
                <!--<div class="hint">上限值为下一个阶段的下限</div>-->
                <!--</md-input-container>-->
                <!--<md-input-container flex class="md-block">-->
                <!--<input min="0" max="1" type="number" step="0.01" required name="{{'Rate'+$index}}"-->
                <!--ng-model="item.Rate">-->
                <!--<div class="hint">该阶段应缴税的比例</div>-->

                <!--</md-input-container>-->
            </md-list-item>
            <md-list-item layout="row">
                <div flex>
                    <md-button ng-disabled="loadding||TaxSettingForm.$invalid" class="md-fab md-mini"
                               ng-click="addTaxItem()" aria-label="添加">
                        <i class="fa fa-plus"></i>
                    </md-button>

                </div>
                <span flex ng-bind="currentLowBound"></span>
                <md-input-container flex class="md-block">
                    <input type="number" required name="CurrentUpBound" min="{{currentLowBound}}"
                           ng-model="currentUpBound" aria-label="上值">
                    <div class="hint">上限值为下一个阶段的下限</div>
                    <div ng-messages="TaxSettingForm.CurrentUpBound.$error">
                        <div ng-message="required">请填写上值</div>
                        <div ng-message="min">上值不能小于下值</div>
                    </div>
                </md-input-container>
                <md-input-container flex class="md-block">
                    <input min="0" max="1" type="number" step="0.01" required name="CurrentRate"
                           ng-model="currentRate" aria-label="税率">
                    <div ng-messages="TaxSettingForm.CurrentRate.$error">
                        <div ng-message="required">税率</div>
                        <div ng-message="min">税率不能小于0</div>
                        <div ng-message="max">税率不能大于1</div>
                    </div>
                </md-input-container>
            </md-list-item>
        </md-list>
        <md-button ng-disabled="loadding||TaxSettingForm.$invalid||TaxSettingFormBase.$invalid" class="md-raised"
                   ng-click="addTaxSetting()">
            <div layout="row" layout-align="center center">
                <div flex="30" ng-show="loadding">
                    <md-progress-circular class="md-accent" md-mode="indeterminate"
                                          md-diameter="40"></md-progress-circular>
                </div>
                <span flex>保存</span>
            </div>
        </md-button>
    </form>

</div>